<!--
 * Copyright (c) 2013-Now http://jeesite.com All rights reserved.
 * No deletion without permission, or be held responsible to law.
 * @author FIRE
-->
<template>
  <div>
      <!-- @close="handleSuccess" -->
      <BasicDrawer
      v-bind="$attrs"
      @register="registerDrawer"
      :title="getTitle.value"
      :showFooter="false"
      width="50%">
      <!--  okText="打印托盘"  cancelText="全部关闭" -->
      <!-- <template #title>
        <span> 托盘打印 </span>
      </template> -->
      <!-- <BasicTable @register="registerTable">
      </BasicTable> -->
      <Tabs v-model:activeKey="activeKey" @change="tabchange">
        <TabPane
          v-for="(item, index) in tabsFormSchema"
          :key="item.key"
          v-bind="omit(item, ['Table', 'key'])"
        >
          <BasicTable ref="tableRefs[index]" @register="item.Table" />
        </TabPane>
      </Tabs>
    </BasicDrawer>
    
  </div>
  </template>
<script lang="ts" setup>
  import { ref, unref, onMounted } from 'vue';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { BasicTable, useTable, BasicColumn, BasicTableProps } from '/@/components/Table';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useGlobSetting } from '/@/hooks/setting';
  import { dictDataListData } from '/@/api/sys/dictData';
  import { router } from '/@/router';
  import { Tabs } from 'ant-design-vue';
  import { omit } from 'lodash-es';
  import { basBarMbasBarRdsListData, basBarMForm } from '/@/api/barcode/basBarM';
  const { meta } = unref(router.currentRoute);
  const { ctxPath  } = useGlobSetting();
  const getTitle = {
      icon: meta.icon || 'i-ant-design:book-outlined',
      value: router.currentRoute.value.query.tabTitle || '条码明细',
  };

  const optionsValues = [];
  const showPrintModal = ref(false);

  const TabPane = Tabs.TabPane;
  type paramsType = {
    createDate: string;
    snType: string;
    'parentId.id': number;
  }
  const paramsValue: paramsType = {};
  const activeKey = ref('X');
  const loading = ref(false);
  const tabsFormSchema = ref([]);
  const tableRefs = ref([]);
  // dictType
  const emit = defineEmits(['success', 'register']);
  const { t } = useI18n('bas.inv.basInv');
  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data: any) => {
    console.log(data);
    
    
    paramsValue.createDate = data.createDate;
    paramsValue['parentId.id'] = data.id;
    
    tabsFormSchema.value = [];
    console.log('activeKey', activeKey.value);
    await handleTabsFormSchema();
  });
  const tableColumns: BasicColumn[] = [
    {
      title: t('条码内容'),
      dataIndex: 'snCode',
      key: 'a.snCode',
      sorter: true,
      width: 70,
      align: 'left',
    },
  ];
  async function tabchange(key) {
    paramsValue.snType = key
    tabsFormSchema.value.forEach((tab) => {
      if (tab.key === key) {
        const [ register, tableMethods ] = tab.Table;
        tableMethods.setProps({
          columns: tableColumns,
          api: basBarMbasBarRdsListData,
          indexColumnProps: { width: 5 },
          beforeFetch: (params: any) => {
            return { ...paramsValue, ...params };
          },
        })
        tableMethods.reload()

      } 
    });
  }
  async function handleTabsFormSchema() {
    // const res = await dictDataListData({
    //   dictType: 'btdm_bar_type'
    // });
    const res = await basBarMForm({
      id: paramsValue['parentId.id']
    });
    paramsValue.snType = activeKey.value
    res.tableList.forEach((item, index) => {
      console.log('item', item, index);
      if(item.snType == paramsValue.snType){
        tabsFormSchema.value.push({
          key: item.snType,
          tab: item.snName,
          forceRender: true,
          // Table: setupTables()
          Table: useTable({
              columns: tableColumns,
              api: basBarMbasBarRdsListData,
              indexColumnProps: { width: 5 },
              beforeFetch: (params: any) => {
                console.log('params', params, paramsValue);
                return { ...paramsValue, ...params };
              },
            }) // 初始时只加载第一个Tab的数据
        });
      } else {
        tabsFormSchema.value.push({
          key: item.snType,
          tab: item.snName,
          forceRender: true,
          Table: useTable() // 初始时只加载第一个Tab的数据
        });
      }


    });
  }

</script>
